import React from 'react';
import { Card } from 'antd';
import styles from './index.less';

const TaskDetailBox = ({ title = '', dataSource = [], style = {}, headStyle = {} }) => (
    <Card title={title} bordered={false} style={({ minWidth: 300 }, style)} headStyle={headStyle}>
        {dataSource &&
            dataSource.map(item => (
                <div className={styles.taskWrap} key={item.key}>
                    <div className={styles.taskTitle}>{item.render || item.key}</div>
                    <div className={styles.taskValue}>{item.value}</div>
                </div>
            ))}
    </Card>
);

export default TaskDetailBox;
